<template>
  <div class="process-monitoring-box">
      <commpVxeTable
       :key="reCommpVxeTable"
       :config="dataTableConfig"
       :columns="columnsVxe"
       :formItem="formItem"
       @checkboxChange="checkboxChange"
       ref="acceptanceRegistrationRef"
       @searchEvent="searchEvent"
       @resetEvent="resetEvent"
       >
          <template v-slot:externalOperations="{data}">
            <vxe-form-item>
                  <template>
                      <a-button class="blue-btn" type="primary" @click="handle">批量设置年度考核</a-button>
                  </template>
              </vxe-form-item>
              <vxe-form-item>
                  <template>
                      <a-button class="blue-btn" type="primary" @click="exportClick">导出</a-button>
                  </template>
              </vxe-form-item>
          </template>
          <template v-slot:operation_ffsrmc="{row}" data-desc="姓名">
            <span style="padding-right: 21;" v-if="row.fusermc&&row.fusermc.length == 2">
                <span v-for="(trem,tI) in row.fusermc.split('')" :key="tI" >
                    {{trem}}
                    <span v-if="tI+1 !== row.fusermc.split('').length">&nbsp;&nbsp;</span>
                </span>
            </span>
            <span style="padding-right: 21;" v-else>{{ row.fusermc }}</span>
          </template>
          <template v-slot:name_fzjjssj="{row}">
              <span>{{row.fzjkssj}}至{{row.fzjjssj}}</span>
          </template>
          <template v-slot:operation_fcql="{row}" data-desc="出勤率">
            {{ row.fcql }} %
          </template>
      </commpVxeTable>
      <batchKaoPingModal ref="batchKaoPingModalRef" @batchSubmit="batchSubmit"></batchKaoPingModal>
  </div>
</template>
<script>
import assessCheckApi from './service/api'
import commpVxeTable from '@/components/commp-vxe-table/commp-vxe-table.vue'
import batchKaoPingModal from './batchKaoPing'
import moment from 'moment'
import {exportNdkpData,batchSubmitNdkp} from './service/index'
export default {
  components:{
      commpVxeTable,batchKaoPingModal
  },
  props:{},
  data(){
      return{
          processingData:{},
          reCommpVxeTable: '',
          formItem:[
              {
                  label: '年度',
                  model: 'fsxmc',
              },{
                  label: '姓名',
                  model: 'fusermc',
              },{
                  label: '工作单位',
                  model: 'fgzdw',
              },{
                  label: '审评次数大于',
                  model: 'fcjjccs',
              },
          ],
          columnsVxe:[
          {
              type: 'checkbox',
              width: 60 ,
              fixed: 'left'
          },{
              title: '姓名', //列头显示文字
              field: 'fusermc',
              width: 100,
              titleInterval:true,
              slots: {
              // 使用插槽模板渲染
                  header:'data1_header',
                  default:'operation_ffsrmc',
              },
          },{
              title: '工作单位',
              field: 'fgzdw',
          },{
              title: '年度',
              field: 'fyear',
              width: 100,
              titleInterval:true,
              slots: {
              // 使用插槽模板渲染
                  header:'data2_header',
              },
          },{
              title: '参加审评次数',
              field: 'fcjjccs',
              width: 120,
          },{
              title: '出勤率',
              field: 'fcql',
              width: 100,
              slots: {
                  default:'operation_fcql',
              },
          },{
              title: '日常考核情况',
              field: 'frcywnlkhqk',
          },{
              title: '提交时间',
              field: 'fndkpsj',
              width: 200,
          },{
              title: '年度考核结果',
              field: 'fndzhkpjg',
              width: 120,
          },],
          dataTableConfig:{
              api: assessCheckApi.queryNdkpglRyPageList,
              rowId: 'id',
              paramet:{}
          },
          idList:[],
          nameList: [],
      }
  },
  watch:{

  },
  mounted(){

  },
  methods:{
      searchEvent(){//搜索
          //console.log(this.inspectionTime)
          this.dataTableConfig.paramet = {
              ...this.dataTableConfig.paramet,
              fzjkssj:this.inspectionTime[0]?moment(this.inspectionTime[0]).format('YYYY-MM-DD'):'',
              fzjjssj:this.inspectionTime[1]?moment(this.inspectionTime[1]).format('YYYY-MM-DD'):'',
          }
          //console.log(this.dataTableConfig.paramet)
      },
      resetEvent(){//重置
          this.inspectionTime = []
          this.dataTableConfig.paramet = {
              ...this.dataTableConfig.paramet,
              fzjkssj:'',
              fzjjssj:'',
          }
      },
      checkboxChange(val){
          //console.log('选择项',val)
          this.idList = []
          this.nameList = []
          if(val.length){
              val.forEach(item => {
                  this.idList.push(item.id)
                  this.nameList.push(item.fusermc)
              });
          }
      },
      exportClick(){//导出
            var that = this
            if(that.idList.length == 0){
                that.$message.warning('请选择导出项')
                return
            }
            that.$confirm({
            title: '您确定要导出这些记录吗?',
            content: '',
            okText: '确定',
            okType: 'info',
            cancelText: '取消',
            onOk() {
              var fileName = '年度考评基本信息表'
              let list = that.idList.toString()
              exportNdkpData({ids: list}).then((data) => {
                  // //console.log(data)
                  if (!data) {
                      that.$message.warning('文件下载失败')
                      return
                  }
                  if (typeof window.navigator.msSaveBlob !== 'undefined') {
                      window.navigator.msSaveBlob(new Blob([data], { type: 'application/vnd.ms-excel' }), fileName + '.xls')
                  } else {
                      let url = window.URL.createObjectURL(new Blob([data], { type: 'application/vnd.ms-excel' }))
                      let link = document.createElement('a')
                      link.style.display = 'none'
                      link.href = url
                      link.setAttribute('download', fileName + '.xls')
                      document.body.appendChild(link)
                      link.click()
                      document.body.removeChild(link) //下载完成移除元素
                      window.URL.revokeObjectURL(url) //释放掉blob对象
                  }
              })
            },
            onCancel() {
              //console.log('Cancel');
            },
        });
      },
      handle(){
        if(this.idList.length == 0){
          this.$message.warning('请选择导出项')
          return
        }
        this.$refs.batchKaoPingModalRef.getData(this.nameList)
        this.$refs.batchKaoPingModalRef.visible = true
      },
      // 批量提交并设置考核结果
      batchSubmit(val){
        let data = {
          ids: this.idList.toString(),
          kpjg: val
        }
        batchSubmitNdkp(data).then(res => {
          if(res.code == 200){
            this.$message.success(res.message)
            this.$refs.batchKaoPingModalRef.closeVisible()
            this.reCommpVxeTable = Date.now()
          } else {
            this.$message.warning(res.message)
          }
        })
      }
  }
}
</script>
<style lang="less">
.vxe-fyear{
  padding-top: 0 !important;

}
.fyear-box{
  .ant-input-number{
      width: 105px !important;
  }
}
.red-btn{
  border: 1px solid #ed5565 !important;
  background-color: #ed5565 !important;
}
</style>
